* {
  margin: 0;
  padding: 0;
}

.fade-enter {
  opacity: 0;
  transform: scale(0) !important;
}
.fade-enter-active {
  opacity: 1;
  transform: scale(1) !important;
  transition: all 0.3s ease-in;
}

.fade-exit {
  opacity: 1;
  position: relative;
  transform: scale(1) !important;
}
.fade-exit-active {
  opacity: 0;
  transition: all 0.3s ease-in;
  transform: scale(0) !important;
}

.slide-enter {
  opacity: 0;
  width: 0px !important;
}
.slide-enter-active {
  opacity: 1;
  width: 25vw !important;
  transition: all 0.3s ease-in;
}

.slide-exit {
  opacity: 1;
  width: 25vw !important;
}
.slide-exit-active {
  width: 0px !important;
  opacity: 0;
  transition: all 0.3s ease-in;
}